<form nz-form id="irInfoDetail" [formGroup]="validateForm" (ngSubmit)="submitForm()"
	style="padding: 0.05rem; margin-top: -20px;background-color: #353c70;"
	onkeypress="if(event.keyCode===13||event.which===13){return false;}">

	<div nz-row  class="irInfoDetailSS">
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Incident_Id' | translate}}
				</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<input nz-input formControlName="ir_ID" />
				</nz-form-control>
			</nz-form-item>
		</div>
		<div nz-col class="gutter-row" nz-col nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzSpan="12">
					{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<nz-select formControlName="veri_State">
						<nz-option *ngFor="let option of verificationStatus" [nzValue]="option.value"
							[nzLabel]="'TrafficManagement.IncidentRecord.'+option.name|translate"></nz-option>
					</nz-select>
				</nz-form-control>
			</nz-form-item>
		</div>
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Cause_Ir_Id' | translate}}
				</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<input nz-input formControlName="cause_IR_ID" />
				</nz-form-control>
			</nz-form-item>
		</div>
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzRequired nzSpan="13">{{'TrafficManagement.IncidentRecord.Source' | translate}}
				</nz-form-label>
				<nz-form-control nz-col nzSpan="11">
					<!-- <input nz-input formControlName="source" /> -->
					<nz-select formControlName="source">
						<nz-option *ngFor="let option of sourceType" [nzValue]="option.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+option.name|translate">
						</nz-option>
					</nz-select>
				</nz-form-control>
			</nz-form-item>
		</div>
	</div>
	<div nz-row >
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzRequired nzSpan="12">
					{{'TrafficManagement.IncidentRecord.Incident_Type' | translate}}</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<!-- <input nz-input formControlName="incidentType"/> -->
					<nz-select formControlName="type" (ngModelChange)='changeIncidentType($event)'>
						<nz-option *ngFor="let option of incidentType" [nzValue]="option.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+option.name|translate">
						</nz-option>
					</nz-select>
				</nz-form-control>
			</nz-form-item>
		</div>
		<!-- <div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzSpan="12">Incident Sub Type</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<input nz-input formControlName="irSub" />
				</nz-form-control>
			</nz-form-item>
		</div> -->
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col  nzSpan="12">{{'TrafficManagement.IncidentRecord.Zone_ID' | translate}}
				</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<input nz-input formControlName="zone_ID" />
				</nz-form-control>
			</nz-form-item>
		</div>
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nzRequired nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Cause' | translate}}
				</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<!-- <input nz-input formControlName="cause" /> -->
					<nz-select formControlName="cause">
						<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.name|translate"
							*ngFor="let item of causeList"></nz-option>
					</nz-select>
				</nz-form-control>
			</nz-form-item>
		</div>
	</div>
	<div nz-row >
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzRequired nzSpan="12">
					{{'TrafficManagement.IncidentRecord.Road_Name' | translate}}</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<input nz-input formControlName="road_Name" />
				</nz-form-control>
			</nz-form-item>
		</div>
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzRequired nzSpan="12">
					{{'TrafficManagement.IncidentRecord.Location_Type' | translate}}</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<nz-select formControlName="location_Type">
						<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.name|translate"
							*ngFor="let item of locationTypeOptions"></nz-option>
					</nz-select>

				</nz-form-control>
			</nz-form-item>
		</div>
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Location_Sub_Type' | translate}}
				</nz-form-label>
				<nz-form-control nz-col nzSpan="12">
					<nz-select formControlName="location_SubType">
						<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.name|translate"
							*ngFor="let item of locationSubTypeOptions"></nz-option>
					</nz-select>
				</nz-form-control>
			</nz-form-item>
		</div>
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nzRequired nz-col nzSpan="13">{{'TrafficManagement.IncidentRecord.Direction' | translate}}</nz-form-label>
				<nz-form-control nz-col nzSpan="11">
						<nz-select formControlName="direction">
							<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label|translate"
								*ngFor="let item of Direction"></nz-option>
						</nz-select>
					<!-- <input nz-input formControlName="direction" /> -->
				</nz-form-control>
			</nz-form-item>
		</div>
	</div>
	<!-- <div nz-row >
        <div nz-col class="gutter-row" nzSpan="12">
            <p style="color: #1890ff;">Start Point</p>
        </div>
        <div nz-col class="gutter-row" nzSpan="12">
            <p style="color: #1890ff;">End Point</p>
        </div>
    </div> -->
	<div nz-row >
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%;display: flex;align-items: center">
				<nz-form-label nz-col nzRequired nzSpan="12">
					{{'TrafficManagement.IncidentRecord.Start_Point' | translate}}</nz-form-label>
				<nz-form-control nz-col nzSpan="10">
					<input nz-input formControlName="startCoor" />
				</nz-form-control>
				<span nz-col nzSpan="2">
					<i class="iconfont icon-dingwei" [ngStyle]="{'color':clickBtn==='startCoor'?'#238ce6':''}"
						(click)="getGisPosition('startCoor')"></i>
				</span>
			</nz-form-item>
		</div>
		<!-- <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">Latitude</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="start_Y_Coor"/>
                </nz-form-control>
            </nz-form-item>
        </div> -->
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%;display: flex;align-items: center">
				<nz-form-label nz-col nzRequired nzSpan="12">{{'TrafficManagement.IncidentRecord.End_Point' | translate}}
				</nz-form-label>
				<nz-form-control nz-col nzSpan="10">
					<input nz-input formControlName="endCoor" />
				</nz-form-control>
				<span nz-col nzSpan="2">
					<i class="iconfont icon-dingwei" [ngStyle]="{'color':clickBtn==='endCoor'?'#238ce6':''}"
						(click)="getGisPosition('endCoor')"></i>
				</span>
			</nz-form-item>
		</div>
		<!-- <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">Latitude</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="end_Y_Coor"/>
                </nz-form-control>
            </nz-form-item>
		</div> -->
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%;display: flex;align-items: center">
				<nz-form-label nzRequired nz-col nzSpan="12">{{'TrafficManagement.IncidentRecord.Q_End_Point' | translate}}
				</nz-form-label>
				<nz-form-control nz-col nzSpan="10">
					<input nz-input formControlName="QendCoor" />
				</nz-form-control>
				<span nz-col nzSpan="2">
					<i class="iconfont icon-dingwei" [ngStyle]="{'color':clickBtn==='QendCoor'?'#238ce6':''}"
						(click)="getGisPosition('QendCoor')"></i>
				</span>
			</nz-form-item>
		</div>
		<div nz-col class="gutter-row" nzSpan="6">
			<nz-form-item nz-col nzSpan="24" style="width:100%">
				<nz-form-label nz-col nzRequired nzSpan="13">{{'TrafficManagement.IncidentRecord.Q_End_Link_ID' | translate}}
				</nz-form-label>
				<nz-form-control nz-col nzSpan="11">
					<input nz-input formControlName="q_End_Link_ID" />
				</nz-form-control>
			</nz-form-item>
		</div>
	</div>
	<!-- <div nz-row >
        <div nz-col class="gutter-row" nzSpan="12">
            <p style="color: #1890ff;">Q-End Point</p>
        </div>
        <div nz-col class="gutter-row" nzSpan="12">
            <p style="color: #1890ff;"></p>
        </div>
    </div> -->
	<!-- <div nz-row >
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">Q End Link ID</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="q_End_Link_ID"/>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
               <nz-form-label nz-col nzSpan="12">Latitude</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="QSPLatitude"/>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">Longitude</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="q_End_X_Coor"/>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col class="gutter-row" nzSpan="6">
            <nz-form-item nz-col nzSpan="24" style="width:100%">
                <nz-form-label nz-col nzSpan="12">Latitude</nz-form-label>
                <nz-form-control nz-col nzSpan="12">
                    <input nz-input formControlName="q_End_Y_Coor"/>
                </nz-form-control>
            </nz-form-item>
        </div>
    </div> -->
	<div nz-row >
		<div nz-col class="gutter-row ant-col-6">
			<nz-form-item nz-col nzSpan="24" style="width:100%" class="flex-div">
				<nz-form-label nz-col nzRequired  class="ant-col-12">
					{{'TrafficManagement.IncidentRecord.Incident_Time' | translate}}</nz-form-label>
				<nz-form-control nz-col>
					<!-- <nz-date-picker [nzFormat]="'yyyy/MM/dd'" formControlName="start_Time"></nz-date-picker> -->
					<!--<input nz-input formControlName="QSPStartTime"/>-->
					<nz-range-picker formControlName="incidentTimeRange" [nzDisabledDate]="disabledDate" class="ant-col-12" ></nz-range-picker>
				</nz-form-control>
			</nz-form-item>
		</div>
		<div nz-col class="gutter-row ant-col-6" >
			<nz-form-item nz-col nzSpan="24" style="width:100%" class="flex-div">
				<nz-form-label  class="ant-col-12"  nz-col nzRequired>{{'TrafficManagement.IncidentRecord.Q_Time' | translate}}
				</nz-form-label>
				<nz-form-control nz-col>
					<!-- <nz-date-picker [nzFormat]="'yyyy/MM/dd'" formControlName="end_Time"></nz-date-picker> -->
					<!--<input nz-input formControlName="QSPEndTime"/>-->
					<nz-range-picker formControlName="QTimeRange" [nzDisabledDate]="disabledDate" class="ant-col-12"></nz-range-picker>
				</nz-form-control>
			</nz-form-item>
		</div>

	</div>


	<div nz-row  >
		<div nz-col class="gutter-row ant-col-6" style=" margin-right: 50px;" >


			<nz-form-item nz-col nzSpan="24" style="width:100%" class="flex-div">
				<nz-form-label nz-col nzRequired class="ant-col-20"  style="margin-right:16px ;">
					{{'TrafficManagement.IncidentRecord.Lane_Blockage' | translate}}</nz-form-label>
				<nz-form-control nz-col>
					<div style="white-space: nowrap;">
						<nz-dropdown [nzTrigger]="'click'" style="display: inline-block;"
							*ngFor="let option of laneBlockagesList;let laneIndex = index">
							<a nz-dropdown>
								<img class="img-lane"
									[src]="'../content/images/icons/' + option.name"
									style="width: 20px;">
							</a>
							<ul nz-menu>
								<li nz-menu-item *ngFor="let option of LANE_BLOCKAGES;let seIndex = index"
									(click)='editLaneBlockages(laneIndex,seIndex)'>
									<img class="img-lane" [src]="'../content/images/icons/'+ option.name"
										style="width: 20px;">
								</li>
								<li nz-menu-item (click)='editLaneBlockages(laneIndex,2)'>
									Del
								</li>
							</ul>
						</nz-dropdown>
						<nz-dropdown [nzTrigger]="'click'" style="display: inline-block;" [ngStyle]="{verticalAlign: 'middle'}">
							<a nz-dropdown><i class="iconfont icon-add"></i></a>
							<ul nz-menu>
								<li nz-menu-item *ngFor="let option of LANE_BLOCKAGES;let idx = index"
									(click)='addLaneBlockages(option)'>
									<img class="img-lane" [src]="'../content/images/icons/'+ option.name"
										style="width: 20px;">
								</li>
							</ul>
						</nz-dropdown>
					</div>
				</nz-form-control>
			</nz-form-item>
		</div>
		<div nz-col class="Expected_Time_To_Clear  gutter-row ant-col-6">
			<nz-form-item nz-col nzSpan="24" class="flex-div">
				<nz-form-label nz-col nzRequired class="ant-col-16"  >
					{{'TrafficManagement.IncidentRecord.Expected_Time_To_Clear' | translate}}</nz-form-label>
				<nz-form-control nz-col>
					<!-- <input nz-input formControlName="expectedTimeToClear"/> -->
					<nz-date-picker nzFormat="yyyy-MM-dd HH:mm:ss" [nzShowTime]="{ nzFormat: 'HH:mm:ss' }"
						formControlName="eTime"></nz-date-picker>
				</nz-form-control>
			</nz-form-item>
		</div>
	</div>
	<div nz-row  style="padding-top: 0.2rem;">
		<!-- <div nz-col class="gutter-row" nzSpan="12">
            <div nz-row >
                <div  nz-col nzSpan="12">
                    <nz-form-item  nz-col nzSpan="12" style="width:100%">
                        <nz-form-label nz-col nzSpan="12">Lane Blockage</nz-form-label>
                        <nz-form-control nz-col nzSpan="12">
							<div>
								<span *ngFor="let option of laneBlockagesList;let idx = index" (click)='deletLaneBlockage(idx)'>
									<img class="img-lane" [src]="'../content/images/icons/' + LANE_BLOCKAGES[option]" style="width: 20px;">
								</span>
							</div>
							<div>
								<nz-dropdown [nzTrigger]="'click'">
										<a nz-dropdown><i class="iconfont icon-add"></i></a>
										<ul nz-menu>
										  <li nz-menu-item *ngFor="let option of LANE_BLOCKAGES;let idx = index" (click) = 'addLaneBlockages(idx)'>
												<img class="img-lane" [src]="'../content/images/icons/'+ option" style="width: 20px;" >
										  </li>
										</ul>
									  </nz-dropdown>
							</div>
                            <input nz-input formControlName="lane_Blockage" style="display: none"/>
                            <nz-select
                                    [nzMaxTagPlaceholder]="tagPlaceHolder"
                                    style="width: 100%"
                                    nzMode="multiple"
                                    formControlName="laneBlockage"
                            >
                                <nz-option *ngFor="let option of listOfOption" [nzLabel]="option.label" [nzValue]="option.value" nzCustomContent >
									<img class="img-lane" [src]="'../content/images/icons/' + option.label" style="width: 20px;">
								</nz-option>
                            </nz-select>
                        </nz-form-control>
                    </nz-form-item>
                </div>
                <div  nz-col nzSpan="12">
                    <nz-form-item nz-col nzSpan="12" style="width:100%">
                        <nz-form-label nz-col nzSpan="12">Expected Time To Clear</nz-form-label>
                        <nz-form-control nz-col nzSpan="12">
							<input nz-input formControlName="expectedTimeToClear"/>
							<nz-date-picker [nzFormat]="'yyyy/MM/dd'" formControlName="eTime"></nz-date-picker>
                        </nz-form-control>
                    </nz-form-item>
                </div>
            </div>
            <div nz-row  style="padding-top: 0.1rem;">
                <div  nz-col nzSpan="24">
                    <nz-form-label nz-col nzSpan="6">Incident Description</nz-form-label>
                    <div nz-col nzSpan="18">
                    <textarea
                            nz-input
                            placeholder=""
                            [nzAutosize]="{ minRows: 3, maxRows: 3 }"
                            formControlName="Description"
                    &gt;</textarea>
                    </div>
                </div>
            </div>
        </div> -->
		<div nz-col class="gutter-row" nzSpan="12">
			<nz-form-item nz-col nzSpan="24" style="width: 100%;">
				<nz-form-label nz-col nzSpan="6"  class="ant-col-12">{{'TrafficManagement.IncidentRecord.Remark' | translate}}
				</nz-form-label>
				<div nz-col nzSpan="18">
					<textarea nz-input placeholder="" [nzAutosize]="{ minRows: 1, maxRows: 1 }"
						formControlName="remark"></textarea>
				</div>
			</nz-form-item>
		</div>
	</div>
	<div nz-row >
		<div nz-row  *ngIf="ifMoreInfoShow">
			<div class="buttonSet" nz-row>
				<div nz-col nzSpan="2">
					<div nz-button nzType="primary" nzBlock (click)="showModal()"
						style="display: flex;align-items: center;justify-content: center; border-radius: 10px;">
						{{'TrafficManagement.IncidentRecord.More_Info' | translate}}
					</div>
				</div>
			</div>
		</div>
		<div nz-row >
			<div class="buttonSet" nz-row>
				<div nz-col nzSpan="2" *ngIf="isFinishShow">
					<button nz-button nzType="default" nzBlock (click)="submitForm()"
						type="button" style=" border-radius: 10px;">{{'TrafficManagement.IncidentRecord.Finish' | translate}}
					</button>
				</div>
				<div nz-col nzSpan="2" *ngIf="isCloseShow">
					<button nz-button nzType="default" nzBlock (click)="finish()"
						type="button"  style=" border-radius: 10px;">{{'TrafficManagement.IncidentRecord.Close' | translate}}
						
					</button>
				</div>
				<div nz-col nzSpan="2" *ngIf="isClickEdit">
					<button nz-button nzType="default" nzBlock (click)="cancelEditFunc()" class="cancelBtn"
						type="button"  style=" border-radius: 10px;">{{'TrafficManagement.IncidentRecord.Cancel' | translate}}
					</button>
				</div>
				<div nz-col nzSpan="2" *ngIf="isEditable && !isClickEdit && accessButton?.Edit">
					<button nz-button nzType="dashed" type="button"  style=" border-radius: 10px;"  nzBlock 
						(click)="editForm()">{{'TrafficManagement.IncidentRecord.Edit' | translate}}
					</button>
				</div>
				<div nz-col nzSpan="2" *ngIf="isClickEdit">
					<button nz-button  style=" border-radius: 10px;"  nzType="primary" [nzLoading]='saveLoading'  class="saveBtn"
						nzBlock>{{'TrafficManagement.IncidentRecord.Save' | translate}}
					</button>
				</div>
			</div>


		</div>
	</div>
</form>

<div class="tableSet new-partner" nz-row>
	<div nz-col nzSpan="16" style="padding: 0.1rem;border:5px solid rgba(96, 184, 246, 0.11);width: 100%">
		<div class="buttonSetBelow">
			<div class="title">
				<h3>{{'TrafficManagement.IncidentRecord.Partner' | translate}}</h3>
			</div>
			<div class="table-buttons-left">
				<ng-container *ngIf="!isEdit;">
					<!-- <div class="operate" style="margin-right: 0.1rem" (click)="addPar($event)">
						<i class="iconfont icon-add"></i>
						{{'TrafficManagement.IncidentRecord.Add_Partner' | translate}}
					</div>
					<div class="left-button-last" style="margin-right: 0.1rem" (click)="refreshPar()"><i
							class="iconfont icon-refresh1"></i></div>
					<div class="left-button-last" style="margin-right: 0.1rem" (click)="startEdit($event)"><i
							class="iconfont icon-pen01"></i></div>
					<div class="left-button-last" style="margin-right: 0.1rem" (click)="deletePar($event)"><i
							class="iconfont icon-fork"></i></div> -->
					<button class="op-btn" nz-button nzType="primary" (click)="addPar($event)"><i nz-icon nzType="plus" nzTheme="outline"></i>{{'TrafficManagement.IncidentRecord.Add_Partner' | translate}}</button>
					<button class="op-btn" nz-button nzType="primary" (click)="refreshPar()" nzShape="circle"><i nz-icon nzType="reload" nzTheme="outline"></i></button>
					<button class="op-btn" nz-button nzType="primary" (click)="startEdit($event)" nzShape="circle"><i nz-icon nzType="edit" nzTheme="outline"></i></button>
					<button nz-button nzType="danger" nzShape="circle" (click)="deletePar($event)"><i nz-icon nzType="delete" nzTheme="outline"></i></button>
				</ng-container>
				<ng-container *ngIf="isEdit;">
					<div class="operate1" style="margin-right: 0.1rem" (click)="onSave($event)">
						{{'TrafficManagement.IncidentRecord.Save' | translate}}
					</div>
					<div class="operate2" style="margin-right: 0.1rem" (click)="cancelEditPar($event)">
						{{'TrafficManagement.IncidentRecord.Cancel' | translate}}
					</div>
				</ng-container>
			</div>
		</div>
		<nz-table #editRowTable [nzData]="partnerData" [nzShowPagination]='false' [nzPageSize]="999"
			class="partner_table" [nzLoading]="partnerLoading" [nzScroll]="{ y: '2.4rem' }">
			<thead>
				<tr>
					<!-- <th nzWidth="0.7rem">{{ 'TrafficManagement.IncidentRecord.ID' | translate }}</th> -->
					<th nzWidth="1.4rem"  style="background-color: #2d325a;color: #7B82B8;">{{ 'TrafficManagement.IncidentRecord.Type' | translate }}</th>
					<th nzWidth="1.1rem"  style="background-color: #2d325a;color: #7B82B8;">{{ 'TrafficManagement.IncidentRecord.vehicle_no' | translate }}</th>
					<th nzWidth="1.1rem"  style="background-color: #2d325a;color: #7B82B8;">{{ 'TrafficManagement.IncidentRecord.Officer_Name_ID' | translate }}</th>
					<th nzWidth="1.1rem"  style="background-color: #2d325a;color: #7B82B8;">{{ 'TrafficManagement.IncidentRecord.Plate_Number' | translate}}</th>
					<th nzWidth="1.7rem"  style="background-color: #2d325a;color: #7B82B8;">{{'TrafficManagement.IncidentRecord.Departure_Date' | translate}}</th>
					<th nzWidth="1.7rem"  style="background-color: #2d325a;color: #7B82B8;">{{'TrafficManagement.IncidentRecord.Arrived_Date' | translate}}</th>
					<th  style="background-color: #2d325a;color: #7B82B8;">{{'TrafficManagement.IncidentRecord.Notified_Date' | translate}}</th>
				</tr>
			</thead>
			<tbody>
				<tr *ngFor="let data of editRowTable.data,index as i " class="table_tr"
					[class.active]="editCache[data.partnerID].active" (click)="selectPar(data.partnerID,i)">
					<!-- <td>
						{{ data.partnerID }}
					</td> -->
					<td>
						<ng-container *ngIf="!editCache[data.partnerID].edit; else type_tpl">
							{{ partnerType[data.type]['name'] }}
						</ng-container>
						<ng-template #type_tpl>
							<nz-select [(ngModel)]="editCache[data.partnerID].data.type" style="width: 1rem">
								<nz-option *ngFor="let partnerType of partnerType" [nzValue]="+partnerType.value"
									[nzLabel]="'TrafficManagement.IncidentRecord.'+partnerType.name|translate"></nz-option>
							</nz-select>
						</ng-template>
					</td>
					<td>
						<ng-container *ngIf="!editCache[data.partnerID].edit; else veh_num_tpl">
							{{ data.veh_Num }}
						</ng-container>
						<ng-template #veh_num_tpl>
							<input type="text" nz-input [(ngModel)]="editCache[data.partnerID].data.veh_Num" />
						</ng-template>
					</td>
					<td>
						{{ data.officer_Name }}
					</td>
					<td>
						<ng-container *ngIf="!editCache[data.partnerID].edit; else plate_num_tpl">
							{{ data.plateNos }}
						</ng-container>
						<ng-template #plate_num_tpl>
							<input type="text" nz-input [(ngModel)]="editCache[data.partnerID].data.plateNos" />
						</ng-template>
					</td>
					<td>

						<ng-container *ngIf="!editCache[data.partnerID].edit; else depart_Date_tpl">
							{{ data.depart_Date | date:'dd/MM/yyyy HH:mm'}}
						</ng-container>
						<ng-template #depart_Date_tpl>
							<nz-date-picker style="width: 0.5rem;" nzFormat="dd/MM/yyyy HH:mm"
								[(ngModel)]="editCache[data.partnerID].data.depart_Date" nzShowTime>
							</nz-date-picker>
						</ng-template>

					</td>
					<td>
						<ng-container *ngIf="!editCache[data.partnerID].edit; else arri_Date_tpl">
							{{ data.arri_Date | date:'dd/MM/yyyy HH:mm'}}
						</ng-container>
						<ng-template #arri_Date_tpl>
							<nz-date-picker style="width: 0.5rem;" nzFormat="dd/MM/yyyy HH:mm"
								[(ngModel)]="editCache[data.partnerID].data.arri_Date" nzShowTime>
							</nz-date-picker>
						</ng-template>

					</td>
					<td>
						<ng-container *ngIf="!editCache[data.partnerID].edit; else notify_Date_tpl">
							{{ data.notify_Date | date:'dd/MM/yyyy HH:mm'}}
						</ng-container>
						<ng-template #notify_Date_tpl>
							<nz-date-picker style="width: 0.5rem;" nzFormat="dd/MM/yyyy HH:mm"
								[(ngModel)]="editCache[data.partnerID].data.notify_Date" nzShowTime>
							</nz-date-picker>
						</ng-template>
					</td>
				</tr>
			</tbody>
		</nz-table>
	</div>
	<div nz-col style="padding: 0.1rem;border:5px solid rgba(96, 184, 246, 0.11);margin: 0.1rem;width: 100%">
		<div class="buttonSetBelow">
			<div class="title">
				<h3>{{'TrafficManagement.IncidentRecord.Comments' | translate}}</h3>
			</div>
			<div class="table-buttons-left">
				<ng-container *ngIf="!isEditComment;">
					<div class="operate" style="margin-right: 0.1rem" (click)="addCom($event)">
						<i class="iconfont icon-add"></i>
						{{'TrafficManagement.IncidentRecord.Add_Comments' | translate}}
					</div>
					<div class="left-button-last" style="margin-right: 0.1rem" (click)="refreshCom()"><i
							class="iconfont icon-refresh1"></i></div>
					<div class="left-button-last" style="margin-right: 0.1rem" (click)="editCom($event)"><i
							class="iconfont icon-pen01"></i></div>
					<div class="left-button-last" style="margin-right: 0.1rem" (click)="deleteCom($event)"><i
							class="iconfont icon-fork"></i></div>
				</ng-container>
				<ng-container>
					<ng-container *ngIf="isEditComment;">
						<div class="operate" style="margin-right: 0.1rem" (click)="saveCom($event)">
							{{'TrafficManagement.IncidentRecord.Save' | translate}}
						</div>
						<div class="operate" style="margin-right: 0.1rem" (click)="cancelEditCom($event)">
							{{'TrafficManagement.IncidentRecord.Cancel' | translate}}
						</div>
					</ng-container>
				</ng-container>


			</div>
		</div>
		<nz-table #commentTable [nzData]="commentsData" [nzShowPagination]='false' [nzPageSize]="999"
			[nzLoading]="commentLoading" [nzScroll]="{ y: '2.4rem' }">
			<thead>
				<tr>
					<th nzWidth="0.7rem">{{'TrafficManagement.IncidentRecord.ID' | translate}}</th>
					<th nzWidth="1.2rem">{{'TrafficManagement.IncidentRecord.Description' | translate}}</th>
					<th nzWidth="1.7rem">{{'TrafficManagement.IncidentRecord.Officer_Name_ID' | translate}}</th>
					<th>{{'TrafficManagement.IncidentRecord.Created_Time' | translate}}</th>
				</tr>
			</thead>
			<tbody>
				<tr *ngFor="let data of commentTable.data, index as i" (click)="selectCom(data.id,i)"
					[class.active]="editCacheComment[data.id].active">
					<td>{{ data.id }}</td>
					<td>
						<ng-container *ngIf="!editCacheComment[data.id].edit; else content_tpl">
							{{ data.content }}
						</ng-container>
						<ng-template #content_tpl>
							<input type="text" nz-input [(ngModel)]="editCacheComment[data.id].data.content" />
						</ng-template>

					</td>
					<td>{{ data.userName }}/{{data.userId}}</td>
					<td>{{ data.createTime | date:'dd/MM/yyyy HH:mm'}}</td>
				</tr>
			</tbody>
		</nz-table>
	</div>
</div>

<nz-modal [(nzVisible)]="isForceVisible" nzTitle="{{'TrafficManagement.IncidentRecord.Cross region operation' | translate}}" (nzOnCancel)="FourchHandleCancel()" (nzOnOk)="ForceHandleOk()">
		<div style="color: white;">
			{{'TrafficManagement.IncidentRecord.Further operation, mandatory operation still available' | translate}}
		</div>
</nz-modal>
<nz-modal [(nzVisible)]="isForceFinishVisible" nzTitle="{{'TrafficManagement.IncidentRecord.Cross region operation' | translate}}" (nzOnCancel)="isForceFinishVisible=false" (nzOnOk)="finish(true)">
	<div  style="color: white;">
		{{'TrafficManagement.IncidentRecord.Further operation, mandatory operation still available' | translate}}
	</div>
</nz-modal>

<!-- more info弹窗 -->
<nz-modal [(nzVisible)]="isVisible" [nzTitle]=false [nzContent]="modalContent" [nzFooter]=false class="modal new-more-info"
	(nzOnCancel)="moreInfoHandleCancel()" (nzOnOk)="moreInfoHandleOk()" handleOk [nzMaskClosable]="false"
	[nzWidth]="modalWidth" class="more-info">
	<ng-template #modalContent style="background-color: #353c70 !important;">
		<div nz-row  class="moreInfoPopUp">
			<div nz-col [nzSpan]="modalSpan">
				<form nz-form [formGroup]="MoreInfo"
					style="padding: 0.2rem;"
					onkeypress="if(event.keyCode===13||event.which===13){return false;}">
					<div nz-row >
						<div nz-col class="gutter-row">
							<ng-container *ngIf="type==='1'">
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Accident_Type' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<nz-select formControlName="acc_Type">
											<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label| translate"
												*ngFor="let item of accTypeOptions" style="color: RED;"></nz-option>
										</nz-select>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Acc_Type_Oth' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<input nz-input formControlName="acc_Type_Oth" />
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Damage' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<input nz-input formControlName="damage" />
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Danger_Type' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<nz-select formControlName="danger_Type">
											<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label|translate"
												*ngFor="let item of dangerTypeOptions"></nz-option>
										</nz-select>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Danger_Type_Oth' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<input nz-input formControlName="danger_Type_Oth" />
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Road_State' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<nz-select formControlName="road_State">
											<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label|translate"
												*ngFor="let item of roadStateOptions"></nz-option>
										</nz-select>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Slight_No' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<input nz-input type="number" formControlName="slight_No" min="0" (blur)="test('slight_No')"/>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Serious_No' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<input nz-input type="number" formControlName="serious_No" min="0" (blur)="test('serious_No')"/>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Fatal_No' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<input nz-input type="number" formControlName="fatal_No" min="0" (blur)="test('fatal_No')"/>
									</nz-form-control>
								</nz-form-item>
							</ng-container>

							<ng-container *ngIf="type ==='5'">
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Obstacle_Type' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<nz-select formControlName="obstacle_Type">
											<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label | translate"
												*ngFor="let item of obstacleTypeOptions"></nz-option>
										</nz-select>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Obstacle_Type_Oth' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12">
										<input nz-input formControlName="obstacle_Type_Oth" />
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="12">
										{{'TrafficManagement.IncidentRecord.Time_Of_Removal' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="12" class="more_info_data_picker">
										<nz-date-picker formControlName="time_Of_Removal" nzShowTime
											nzFormat="yyyy/MM/dd HH:mm" nzPlaceHolder="Select Time">
										</nz-date-picker>
									</nz-form-control>
								</nz-form-item>

							</ng-container>

							<ng-container *ngIf="type ==='7'">
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Road_Work_Type' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<nz-select formControlName="roadWork_Type">
											<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label|translate"
												*ngFor="let item of roadWorkTypeOptions"></nz-option>
										</nz-select>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Road_Work_Type_Oth' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<input nz-input formControlName="roadWork_Type_Oth" />
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Supervisor' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<input nz-input formControlName="supervisor" />
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Contractor' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<input nz-input formControlName="contractor" />
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Handphone' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<input nz-input formControlName="handphone" />
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Permit' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<input nz-input formControlName="permit" />
									</nz-form-control>
								</nz-form-item>
							</ng-container>

							<ng-container *ngIf="type ==='2'">
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Weather_Detail' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<nz-select formControlName="weather_Detail">
											<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label | translate"
												*ngFor="let item of weatherDetailOptions"></nz-option>
										</nz-select>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Opinion' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<nz-select formControlName="opinion">
											<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label | translate"
												*ngFor="let item of opinionOptions"></nz-option>
										</nz-select>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Weather_Visibility' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<nz-select formControlName="visibility">
											<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label| translate"
												*ngFor="let item of visibilityOptions"></nz-option>
										</nz-select>
									</nz-form-control>
								</nz-form-item>
								<nz-form-item nz-col nzSpan="24" style="width:100%">
									<nz-form-label nz-col nzSpan="10">
										{{'TrafficManagement.IncidentRecord.Weather_Event' | translate}}
									</nz-form-label>
									<nz-form-control nz-col nzSpan="14">
										<nz-select formControlName="weather_Event">
											<nz-option [nzValue]="item.value" [nzLabel]="'TrafficManagement.IncidentRecord.'+item.label|translate"
												*ngFor="let item of weatherEventOptions"></nz-option>
										</nz-select>
									</nz-form-control>
								</nz-form-item>
							</ng-container>
						</div>

					</div>
				</form>
			</div>
			<div nz-col class="gutter-row ir-info-detail-table" [nzSpan]="modalTableSpan" *ngIf='showMoreInfoTable'>
				<div class="tableSet" nz-row>
					<div nz-col style="padding: 0.1rem;border:5px solid rgba(96, 184, 246, 0.11);margin: 0.1rem;width: 100%">
						<div class="buttonSetBelow">
							<div class="title">
								<h3>
									{{'TrafficManagement.IncidentRecord.Tow' | translate}}
								</h3>
							</div>
							<div class="table-buttons-left" [hidden]="!isClickEdit">
								<ng-container *ngIf="!isEditTow">
									<div class="operate" style="margin-right: 0.1rem" (click)="addTow($event)">
										<i class="iconfont icon-add"></i>
										{{'TrafficManagement.IncidentRecord.Add_Tow' | translate}}
									</div>
									<div class="left-button-last" style="margin-right: 0.1rem" (click)="refreshTwo()"><i
											class="iconfont icon-refresh1"></i>
									</div>
									<div class="left-button-last" style="margin-right: 0.1rem"
										(click)="editTow($event)"><i class="iconfont icon-pen01"></i></div>
									<!-- <div class="left-button-last" style="margin-right: 0.1rem"><i
												class="iconfont icon-fork"></i></div> -->
								</ng-container>
								<ng-container *ngIf="isEditTow">
									<div class="operate" style="margin-right: 0.1rem" (click)="saveTow()">
										{{'TrafficManagement.IncidentRecord.Save' | translate}}
									</div>
									<div class="operate" style="margin-right: 0.1rem" (click)="cancelEditTow($event)">
										{{'TrafficManagement.IncidentRecord.Cancel' | translate}}
									</div>
								</ng-container>
							</div>
						</div>
						<nz-table #towDataTable [nzData]="towData" [nzShowPagination]='false'>
							<thead>
								<tr>
									<th nzWidth="6.5%">{{'TrafficManagement.IncidentRecord.Officer_Name_ID' | translate}}</th>
									<th nzWidth="13.5%">{{'TrafficManagement.IncidentRecord.Departure_Time' | translate}}</th>
									<th nzWidth="13.5%">{{'TrafficManagement.IncidentRecord.Arrival_Time' | translate}}</th>
									<th nzWidth="13.5%">{{'TrafficManagement.IncidentRecord.Notify_Time' | translate}}</th>
									<th nzWidth="7%">{{'TrafficManagement.IncidentRecord.CarPark_No' | translate}}</th>
									<th nzWidth="7%">{{'TrafficManagement.IncidentRecord.TC_Report_No' | translate}}</th>
									<th nzWidth="7%">{{'TrafficManagement.IncidentRecord.Towed_Veh_Car' | translate}}</th>
									<th nzWidth="7%">{{'TrafficManagement.IncidentRecord.Towing_Type' | translate}}</th>
									<th nzWidth="7%">{{'TrafficManagement.IncidentRecord.Towing_Vehicle_Car' | translate}}</th>
									<th nzWidth="10%" *ngIf="type === '5'">{{'TrafficManagement.IncidentRecord.Towing_Vehicle_Num' | translate}}</th>
									<th nzWidth="4%">{{'TrafficManagement.IncidentRecord.Vehicle_Number' | translate}}</th>
									<th nzWidth="4%">{{'TrafficManagement.IncidentRecord.Towing_Company' | translate}}</th>
								</tr>
							</thead>
							<tbody>
								<tr *ngFor="let data of towDataTable.data;index as i" (click)="chooseTow(data.ir_ID,i)"
									[class.active]="editCacheTow[data.ir_ID].active">
									<!-- <td>{{ data.ir_ID }}</td> -->
									<td>{{ data.officer_Name }}</td>
									<td class="tow_table">
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else tow_depart_date_tpl">
											{{ data.depart_Date | date:'dd/MM/yyyy HH:mm'}}
										</ng-container>
										<ng-template #tow_depart_date_tpl>
											<nz-date-picker style="width: 0.8rem;" nzFormat="dd/MM/yyyy HH:mm"
												[(ngModel)]="editCacheTow[data.ir_ID].data.depart_Date" nzShowTime>
											</nz-date-picker>
										</ng-template>
									</td>
									<td class="tow_table">
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else tow_arri_date_tpl">
											{{ data.arri_Date | date:'dd/MM/yyyy HH:mm'}}
										</ng-container>
										<ng-template #tow_arri_date_tpl>
											<nz-date-picker style="width: 0.5rem;" nzFormat="dd/MM/yyyy HH:mm"
												[(ngModel)]="editCacheTow[data.ir_ID].data.arri_Date" nzShowTime>
											</nz-date-picker>
										</ng-template>

									</td>
									<td class="tow_table">
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else tow_notify_date_tpl">
											{{ data.notify_Date | date:'dd/MM/yyyy HH:mm'}}
										</ng-container>
										<ng-template #tow_notify_date_tpl>
											<nz-date-picker style="width: 0.5rem;" nzFormat="dd/MM/yyyy HH:mm"
												[(ngModel)]="editCacheTow[data.ir_ID].data.notify_Date" nzShowTime>
											</nz-date-picker>
										</ng-template>
									</td>
									<td>
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else car_park_tpl">
											{{ data.carPark_No }}
										</ng-container>
										<ng-template #car_park_tpl>
											<input type="text" nz-input
												[(ngModel)]="editCacheTow[data.ir_ID].data.carPark_No" />
										</ng-template>
									</td>
									<td>
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else tc_report_tpl">
											{{ data.tc_Report_No }}
										</ng-container>
										<ng-template #tc_report_tpl>
											<input type="text" nz-input
												[(ngModel)]="editCacheTow[data.ir_ID].data.tc_Report_No" />
										</ng-template>

									</td>

									<td>
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else towed_veh_tpl">
											{{ towedVehCarType[data.towed_Veh_Cat]['name'] }}
										</ng-container>
										<ng-template #towed_veh_tpl>
											<nz-select [(ngModel)]="editCacheTow[data.ir_ID].data.towed_Veh_Cat"
												style="width: 1rem">
												<nz-option *ngFor="let item of towedVehCarType" [nzValue]="+item.value"
													[nzLabel]="'TrafficManagement.IncidentRecord.'+item.name|translate">
												</nz-option>
											</nz-select>
										</ng-template>
									</td>

									<td>
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else towing_type_tpl">
											{{ towingType[data.towing_Type]['name'] }}
										</ng-container>
										<ng-template #towing_type_tpl>
											<nz-select [(ngModel)]="editCacheTow[data.ir_ID].data.towing_Type"
												style="width: 1rem">
												<nz-option *ngFor="let item of towingType" [nzValue]="item.value"
													[nzLabel]="'TrafficManagement.IncidentRecord.'+item.name|translate">
												</nz-option>
											</nz-select>
										</ng-template>
									</td>
									<td>
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else towing_veh_tpl">
											{{ 'TrafficManagement.IncidentRecord.'+towingVehCarType[data.towing_Veh_Cat]['name'] |translate}}
										</ng-container>
										<ng-template #towing_veh_tpl>
											<nz-select [(ngModel)]="editCacheTow[data.ir_ID].data.towing_Veh_Cat"
												style="width: 1rem">
												<nz-option *ngFor="let item of towingVehCarType" [nzValue]="+item.value"
													[nzLabel]="'TrafficManagement.IncidentRecord.'+item.name|translate">
												</nz-option>
											</nz-select>
										</ng-template>
									</td>
									<td>
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else towed_veh_num_tpl">
											{{ data.towed_Veh_Num }}
										</ng-container>
										<ng-template #towed_veh_num_tpl>
											<input type="text" nz-input
												[(ngModel)]="editCacheTow[data.ir_ID].data.towed_Veh_Num" />
										</ng-template>
									</td>
									<td *ngIf="type === '5'">
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else towed_veh_num_tpl">
											{{ data.towing_Veh_Num }}
										</ng-container>
										<ng-template #towed_veh_num_tpl>
											<input type="text" nz-input
												[(ngModel)]="editCacheTow[data.ir_ID].data.towing_Veh_Num" />
										</ng-template>
									</td>
									<td>
										<ng-container *ngIf="!editCacheTow[data.ir_ID].edit; else towing_company_tpl">
											{{ data.towing_Company }}
										</ng-container>
										<ng-template #towing_company_tpl>
											<input type="text" nz-input
												[(ngModel)]="editCacheTow[data.ir_ID].data.towing_Company" />
										</ng-template>
									</td>
								</tr>
							</tbody>
						</nz-table>
					</div>
				</div>
			</div>
		</div>
	</ng-template>
</nz-modal>
<!-- <nz-modal [(nzVisible)]="otherInfoShow" [nzTitle]=false [nzContent]="modalContent11" [nzFooter]=false
	(nzOnCancel)="handleCancel()" [nzMaskClosable]="false" [nzWidth]="'6.94rem'">
	<ng-template #modalContent11>
		<div class="moreInfoPopUp">
			<form nz-form [formGroup]="validateForm" (ngSubmit)="submitForm()" style="padding: 0.2rem 0px;"
				onkeypress="if(event.keyCode===13||event.which===13){return false;}">
				<div nz-row >
					<div nz-col class="gutter-row" nzSpan="24">
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">
								{{'TrafficManagement.IncidentRecord.Incident_ID' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="ir_ID" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">
								{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">
								{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">
								{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">
								{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
						<nz-form-item nz-col nzSpan="24" style="width:100%">
							<nz-form-label nz-col nzSpan="12">
								{{'TrafficManagement.IncidentRecord.Verification_Status' | translate}}</nz-form-label>
							<nz-form-control nz-col nzSpan="12">
								<input nz-input formControlName="veri_State" />
							</nz-form-control>
						</nz-form-item>
					</div>
				</div>
			</form>
		</div>
	</ng-template>
</nz-modal> -->
